﻿@{
    // ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}


<div class="layui-layout layui-layout-admin">
    <div><span class="layui-breadcrumb">
    <a href="/">首页</a>
    <a href="/demo/">演示</a>
    <a><cite>导航元素</cite></a>
</span></div>
   

    <div style="display: inline-block; width: 200px; height: 200px; padding: 10px; border: 1px solid #ddd; overflow: auto;">
        <ul id="demo2" class="layui-box layui-tree"><li><i class="layui-icon layui-tree-spread"></i><a href="javascript:;"><i class="layui-icon layui-tree-branch"></i><cite>常用文件夹</cite></a><ul class=""><li><a href="http://www.layui.com/" target="_blank"><i class="layui-icon layui-tree-leaf"></i><cite>所有未读（设置跳转）</cite></a></li><li><a href="javascript:;"><i class="layui-icon layui-tree-leaf"></i><cite>置顶邮件</cite></a></li><li><a href="javascript:;"><i class="layui-icon layui-tree-leaf"></i><cite>标签邮件</cite></a></li></ul></li><li data-spread="true"><i class="layui-icon layui-tree-spread"></i><a href="javascript:;"><i class="layui-icon layui-tree-branch"></i><cite>我的邮箱</cite></a><ul class="layui-show"><li data-spread="true"><i class="layui-icon layui-tree-spread"></i><a href="javascript:;"><i class="layui-icon layui-tree-branch"></i><cite>QQ邮箱</cite></a><ul class="layui-show"><li><i class="layui-icon layui-tree-spread"></i><a href="javascript:;"><i class="layui-icon layui-tree-branch"></i><cite>收件箱</cite></a><ul class=""><li><a href="javascript:;"><i class="layui-icon layui-tree-leaf"></i><cite>所有未读</cite></a></li><li><a href="javascript:;"><i class="layui-icon layui-tree-leaf"></i><cite>置顶邮件</cite></a></li><li><a href="javascript:;"><i class="layui-icon layui-tree-leaf"></i><cite>标签邮件</cite></a></li></ul></li><li><a href="javascript:;"><i class="layui-icon layui-tree-leaf"></i><cite>已发出的邮件</cite></a></li><li><a href="javascript:;"><i class="layui-icon layui-tree-leaf"></i><cite>垃圾邮件</cite></a></li></ul></li><li><i class="layui-icon layui-tree-spread"></i><a href="javascript:;"><i class="layui-icon layui-tree-branch"></i><cite>阿里云邮</cite></a><ul class=""><li><a href="javascript:;"><i class="layui-icon layui-tree-leaf"></i><cite>收件箱</cite></a></li><li><a href="javascript:;"><i class="layui-icon layui-tree-leaf"></i><cite>已发出的邮件</cite></a></li><li><a href="javascript:;"><i class="layui-icon layui-tree-leaf"></i><cite>垃圾邮件</cite></a></li></ul></li></ul></li></ul>
    </div>
    <div class="site-tips" style="position: absolute; left: 260px; right: 10px; top: 0; bottom: 0; z-index: 998; width: auto; overflow: hidden; overflow-y: auto; box-sizing: border-box" id="demo2-view">
        <div style="margin:10px 0px;">
            <button class="layui-btn layui-btn-small" onclick="add()"><i class="layui-icon">&#xe61f;</i> 添加</button>
        </div>
        <table class="layui-hide" id="LAY_table_user" lay-filter="user"></table>
    </div>
        
   
    </div>
  
        <script>
            layui.use(['table', 'laytpl', 'layer'], function () {
                var table = layui.table;
                var laytpl = layui.laytpl;
                var layer = layui.layer;
                //方法级渲染
                table.render({
                    elem: '#LAY_table_user'
                  , url: '/admin/PermissionMgr/GetPermissionList'
                  , cols: [[
                    { checkbox: true, fixed: true }
                    , { field: 'id', title: 'ID', width: 80, fixed: true }
                    , { field: 'user_name', title: '用户账号', width: 120 }
                    , { field: 'nickname', title: '昵称', width: 120 }
                    , { field: 'author', title: '作者名称', width: 100 }
                    , { field: 'telphone', title: '家庭电话', width: 120 }
                    , { field: 'email', title: '邮箱', width: 180 }
                    , { field: 'address', title: '常用地址', width: 250 }
                    , { field: 'sex', title: '性别', width: 60 }
                    , { field: 'avatar', title: '作者图像', width: 90, templet: '#avatar_tpl' }
                    , { field: 'status', title: '状态', width: 60, templet: '#status_tpl' }
                    , { field: 'qq', title: 'qq', width: 120 }
                    , { field: 'create_time', title: '添加时间', width: 130, templet: '#time_tpl' }
                    , { field: 'set', title: '操作', align: 'center', width: 200, toolbar: '#set_tool' }
                  ]]
                    , id: 'tid'
                    //,skin: 'line' //风格
                    , even: false
                    , limits: [15, 30, 50]
                    , limit: 15
                    , loading: true
                    , page: true
                    , requert: {
                        pageName: 'PageIndex' //页码的参数名称，默认：page
                        , limitName: 'PageSize' //每页数据量的参数名，默认：limit
                    }
                    , height: 'full-240'
                });

                var $ = layui.$, active = {
                    reload: function () {
                        table.reload('tid', {
                            where: {
                                title: $('#name').val()
                            }
                        });
                    }
                };

                $('.SearchBox .layui-btn').on('click', function () {
                    var type = $(this).data('type');
                    active[type] ? active[type].call(this) : '';
                });


            });

            function deleteRole(rid) {
                deleteById("/admin/SysUserMgr/Delete", { id: rid });
            }

            function add() {
                layer.open({
                    type: 2,
                    title: '添加用户',
                    maxmin: true,
                    shadeClose: true, //点击遮罩关闭层
                    scrollbar: true,
                    area: ['800px', '650px'],
                    content: 'AddOrUp'
                });

            }
            function update(id) {
                layer.open({
                    type: 2,
                    title: '修改用户',
                    maxmin: true,
                    shadeClose: true, //点击遮罩关闭层
                    area: ['800px', '650px'],
                    content: 'AddOrUp?id=' + id
                });
            }
        </script>

        <script type="text/html" id="status_tpl">

            {{#  if(d.status < 1){ }}
            <span class="layui-badge-rim layui-bg-green">正常</span>
            {{#  } else { }}
            <span class="layui-badge-rim layui-bg-gray">停用</span>
            {{#  } }}
        </script>

        <script type="text/html" id="time_tpl">

            {{#  if(d.create_time!= ""){ }}

            {{ timeFormat(d.create_time) }}
            {{#  } }}

        </script>
        <script type="text/html" id="avatar_tpl">

            {{#  if(d.avatar!= ""){ }}
            <img src=" {{ d.avatar }} " class="layui-nav-img">
            {{#  } else { }}
            <img src="/file/sys/avatar/default.jpg" class="layui-nav-img">
            {{#  } }}
        </script>
        <script type="text/html" id="set_tool">
            <button class="layui-btn layui-btn-mini layui-btn-normal" onclick="update('{{ d.id }}')">
                <i class="layui-icon">&#xe642;</i>修改
            </button>
            <button class="layui-btn layui-btn-mini layui-btn-danger" onclick="deleteRole('{{ d.id}}')">
                <i class="layui-icon">&#xe640;</i>删除
            </button>
        </script>
        <script>
            function timeFormat(time) {
                var datastr = eval(time.replace(/\/Date\((\d+)\)\//gi, "new Date($1)")).format('yyyy-MM-dd hh:mm:ss');
                return datastr;
            }

        </script>
